---
title: \uxxxx 转中文，unicode 解码 
layout: default_footer
keywords: [\uxxxx 转中文, unicode 解码]
description: 在线 unicode 解码。 \uxxxx 转中文。\uxxxx 实质是什么 ？为什么会有 \uxxxx 转中文的需求？
---


<style type="text/css">
@media (min-width: 960px) {
    .fl-box {
        width: 50%;
        padding-left: 5px;
    }
}
@media (max-width: 960px) {
    .fl-box {
        width: 100%;
        padding-left:0;
        padding-right:5px;
    }
}
</style>
<script>
    if (typeof localStorage.unicode_activeTab == "undefined") {
        localStorage.unicode_activeTab = 0
    }
</script>

<div class="uk-width-10-10 uk-height-1-1" style="padding-bottom: 50px;">
<!-- 选项卡 -->
<div class="uk-width-10-10" style="margin-bottom: 10px;">
    <ul class="uk-tab uk-tab-top" data-uk-tab="{connect:'#main', active:localStorage.unicode_activeTab, animation:'fade'}">
        <li><a id="activeTab0" onClick="localStorage.unicode_activeTab = 0" rel="nofollow" href="#">解码</a></li>
        <li><a id="activeTab1" onClick="localStorage.unicode_activeTab = 1" rel="nofollow" href="#">介绍</a></li>
        <!-- <li><a id="alipay-red-bao-button" onmouseover="viewAlipayRedBao()" rel="nofollow">支付宝 扫码领红包</a></li> -->
    </ul>
</div>
<script>
    if (localStorage.alipayRedBaoNeedShow != '0') {
        $('#alipay-red-bao-button').show()
        if (new Date().setHours(0,0,0,0) < localStorage.alipayRedBaoViewTime
            && localStorage.alipayRedBaoViewTime < new Date().setHours(23,59,59,0)) {
            $('#alipay-red-bao-button').removeClass('red-point-button')
        } else {
            $('#alipay-red-bao-button').addClass('red-point-button')
        }
    }
    function viewAlipayRedBao () {
        localStorage.alipayRedBaoViewTime = new Date().getTime()
        $('#alipay-red-bao-button').removeClass('red-point-button')
    }
</script>

<!-- 表单、结果 -->
<div class="uk-width-10-10 uk-height-1-1">
    <ul id="main" class="uk-switcher uk-height-1-1">
        <!-- 解码 -->
        <li class="uk-height-1-1">
            <div id="decode" class="uk-grid uk-height-1-1">
                <div class="uk-width-1-2 fl-box uk-height-1-1" style="padding-left:0;padding-right:5px;">
                    <textarea class="uk-width-1-1 uk-height-1-1" style="resize:vertical;" placeholder="unicode 编码。/uxxxx 形式的字符串" spellcheck="false" v-model="origin" v-on:input="onChangeOrigin" autofocus></textarea>
                </div>
                <div class="uk-width-1-2 fl-box uk-height-1-1">
                    <textarea class="uk-width-1-1 uk-height-1-1" style="resize:vertical;" placeholder="中文" spellcheck="false" v-model="chinese" v-on:input="onChangeChinese"></textarea>
                </div>
            </div>
        </li>
        <!-- 介绍 -->
        <li class="uk-height-1-1">
            <div>
                <h2>什么是 \uxxxx ？</h2>
                \uxxxx 转中文，实际上 unicode 编码转中文。我们经常使用的字符编码主要有两种。一种是 utf8，另一种就是 unicode。<br><br>
                utf8 编码一般被用在我们直接编辑的文本，也就是在文本编辑器中所见所得的字符的编码。特点是占用存储空间相对小。<br><br>
                unicode 编码常常作为程序运行过程中，内存中表示字符所使用的编码，特点是每个字符所占用的长度相同。<br><br>
                以上两种编码应该作为一种默认的使用规范。可以完美的避免各种乱码问题。

                <h2>为什么会有 \uxxxx 转中文的需求？</h2>
                因为内存中的字符串，直接对应于我们代码中的一个字符串变量。如果程序规范，它会以 unicode 编码的形式存储在内存中。然后我们直接打印这个字符串变量，经常就出现了 \uxxxx 的所谓乱码。实际是打印的操作不够规范。<br><br>
                可以这样说服自己，我们统一把给人看的字符串用 utf8 表示，给机器看的字符串用 unicode 表示。打印的目的是要给人看，所以多加一句代码把字符串变量由 unicode 转成 utf8 再输出是合理的。
                
                <!-- <h2>vuejs 就很优雅</h2>
                查看本页面的网页源代码，可以看到这样一段代码<br>

<pre><code>data: {
    origin: '', // /uxxxx 形式的字符串
    chinese: '中文'
},
mounted: function () {
    if (localStorage.unicode_tab0_chinese) {
        this.chinese = localStorage.unicode_tab0_chinese
    }
    this.onChangeChinese()
}</code></pre>
注意到 mounted 方法中，用中文作为历史记录的保存依据、页面加载完成后的初始化自动解码。而不是用 /uxxxx 形式的字符串。<br><br>
因为 vue 认为，文本框中的字符串是给人看的，所以如果初始化自动解码使用 data.origin 变量(/uxxxx 形式的字符串), vue 会自动转成中文显示在文本框中。<br><br> -->
            
            </div>
        </li>
        <li class="uk-height-1-1 uk-width-1-1 uk-text-center">
            <img style="width:240px;" src="//cdn.apihub.net/img/alipay-red-bao.jpeg" alt="alipay 红包码">
        </li>
    </ul>
</div>
</div>

<script>
function unicode2Chinese(str){
    let re = str.match(/\\u[0-9a-fA-F]{4}/g);
    if(re == null) {
        return str
    }
    for(let i = 0; i < re.length; i++){
        str = str.replace(re[i], unescape(re[i].replace("\\u","%u")))
    }
    return str
}
function chinese2Unicode(str){
    let ascii = ""
    for (let i = 0; i < str.length; i++) {
        var code = Number(str[i].charCodeAt(0));
        if (code > 127) {
            var charAscii = code.toString(16);
            charAscii = new String("0000").substring(charAscii.length, 4) + charAscii
            ascii += "\\u" + charAscii
        } else {
            ascii += str[i]
        }
    }
    return ascii
}
</script>
<script>
    var vm_unicode = new Vue({
        el: "#decode",
        data: {
            origin: '',
            chinese: '中文'
        },
        mounted: function () {
            if (localStorage.unicode_tab0_chinese) {
                this.chinese = localStorage.unicode_tab0_chinese
            }
            this.onChangeChinese()
        },
        methods: {
            onChangeOrigin: function() {
                this.chinese = unicode2Chinese(this.origin)
                localStorage.unicode_tab0_chinese = this.chinese
            },
            onChangeChinese: function() {
                localStorage.unicode_tab0_chinese = this.chinese
                this.origin = chinese2Unicode(this.chinese)
            }
        }
    })
</script>